<!DOCTYPE html>
<html lang="zh-CN">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>求购发布</title>

    <link rel="stylesheet" type="text/css" href="/css/release.css">
    <link rel="stylesheet" type="text/css" href="/css/index.css">
    <link href="/bootstrap/css/bootstrap.min.css" rel="stylesheet">
<body>
<div class="dingbu">
    <div class="denglu-font top">
        <!--        <a href="/" id="dingbuhome"><img src="/images/logo.jpg"></a>-->

        <!--        <div id="so" style="position: relative; left: 350px;top:8px;width: 100px; float: left;" class="top">-->
        <!--            <div class="input-group">-->
        <!--                <input type="text" class="form-control" id="searchText" style="width: 380px;">-->
        <!--                <span class="input-group-addon" id="search" onclick="search()"><i class="glyphicon glyphicon-search"-->
        <!--                                                                                  style="color: #0055aa;"> <span>搜索</span></i></span>-->
        <!--            </div>-->
        <!--        </div>-->
        <div class="denglu-font2 top">
            <a href="/" id="dingbuhome">返回首页</a>
            <a href="/" id="cart">我的购物车</a><a href="#" id="release">发布商品</a>
            <a href="#" id="uname">zyl</a>
            <a href="login" id="login_logout">登录</a>
        </div>
        <div style="clear:both"></div>
    </div>
</div>

<div id="app"><br><br>
    <div class="header">
            <span>
                <h2 style="position: relative;left: 150px;">求购发布</h2>
            </span>
    </div>
    <br><br>
    <div class="content">
        <table>
            <form id="form1" enctype="multipart/form-data">
                <tr>
                    <td class="text-right">请选择发布求购的图片</td>
                    <td class="content_right">
                        <a href="javascript:;" class="file">
                            <input id="chooseimage" type="file" accept="image/png,image/gif,image/jpg,image/jpeg">
                            <img id="showimage" class="showimage" src="/images/addimage.png">
                        </a>
                    </td>
                </tr>
                <tr>
                    <td class="text-right">求购的商品名称</td>
                    <td class="content_right"><input class="itemname" id="itemname" placeholder="请输入商品名称" required>
                    </td>
                </tr>
                <tr>
                    <td class="text-right">求购描述</td>
                    <td class="content_right"><textarea class="description" rows="5" id="description" type="text"
                                                        placeholder="请输入商品描述"></textarea>
                        <!-- <input class="description" id="password" type="text" placeholder="请输入商品描述"></td> -->
                </tr>
                <tr>
                    <td></td>
                    <td class="content_right">
                        <input type="button" class="btn btn-info" id="submit" value="立即提交">
                    </td>
                </tr>
            </form>
        </table>
    </div>
</div>
</body>
<script src="/jquery/jquery2.1.4.js"></script>
<script src="/layer/layer.js"></script>
<script>

    $(function () {
        load_data()
        $('#chooseimage').change(function () {
            if (checkFile() == false) {
                return
            }
            var file = document.getElementById('chooseimage')
            $('#showimage').attr('src', getObjectURL($('#chooseimage')[0].files[0]))
        })
        $('#itemname').change(function () {
            if (checkName() == false) {
                layer.msg('求购的名字必须大于两个字符')
            }
        })

        $('#submit').click(function () {
            var wantsId = -1
            var userId = localStorage.getItem('userId')
            var itemname = $('#itemname').val()
            var description = $('#description').val()
            // var formdata = new FormData($("#chooseimage")[0]);

            if (checkFile() != false && checkName() != false) {
                $.ajax({
                    url: '/api/wants/release?userId=' + userId,
                    type: 'POST',
                    dataType: 'json',
                    contentType: 'application/json',
                    traditional: true,
                    data: JSON.stringify({
                        'title': itemname,
                        'description': description,
                    }),
                    success: function (data) {
                        if (data.code == 0) {
                            wantsId = data.data.wantsId
                            console.log(wantsId)
                            if (wantsId != -1) {
                                console.log('start transferring image')
                                var type = 'file'
                                var formData = new FormData()
                                formData.append(type, $('#chooseimage')[0].files[0])
                                $.ajax({
                                    url: '/api/wants/upload?wantsId=' + wantsId,
                                    type: 'POST',
                                    data: formData,
                                    async: false,
                                    cache: false,
                                    contentType: false,
                                    processData: false,
                                    success: function (data) {
                                        location.assign('/api/wants/details?wantsId=' + wantsId)

                                    },
                                    error: function (data) {
                                        location.assign('/api/wants/details?wantsId=' + wantsId)
                                        // var res = $.parseJSON(data.responseText);
                                        // layer.msg(res.msg);
                                    }
                                })
                            }
                        } else {
                            layer.msg(data.msg)
                        }
                    },
                    error: function () {

                    }

                })

            } else {
                layer.msg('商品发布失败！')
                return
            }

        })

    })
    $('#login_logout').click(function () {
        localStorage.clear()
    })
    function checkFile() {
        var $file1 = $('#chooseimage').val()
        if ($file1 == '') {
            layer.msg('请选择上传的目标文件! ')
            return false
        }
        var fileName1 = $file1.substring($file1.lastIndexOf('.') + 1).toLowerCase()
        if (fileName1 != 'png' && fileName1 != 'jpg' && fileName1 != 'gif' && fileName1 != 'jpeg') {
            layer.msg('请选择上传图片! ')
            return false
        }
        var size1 = $('#chooseimage')[0].files[0].size
        if (size1 > 10485760) {
            alert('上传文件不能大于10M!')
            return false
        }
        return true
    }

    function changelabel() {
        var level = $('#level').val()
        if (level == 10) {
            $('#levellabel').text('全新')
        } else {
            $('#levellabel').text(level + '成新')
        }
    }

    function checkName() {
        var itemName = $('#itemname').val()
        if (itemName.length < 2) {
            return false
        } else {
            return true
        }
    }

    function checkPrice() {
        var price = $('#price').val() * 1
        if (price == null || price == '' || price <= 0) {
            return false
        } else {
            $('#price').val(price.toFixed(2))
        }
    }

    function checkCount() {
        var count = $('#count').val()
        if (count == null || count == '' || count <= 0) {
            return false
        } else {
            $('#count').val(Math.trunc(count))
            return true
        }
    }

    function checkName() {
        var itemName = $('#itemname').val()
        if (itemName.length < 2) {
            return false
        } else {
            return true
        }
    }

    function getObjectURL(file) {
        var url = null
        if (window.createObjectURL != undefined) { // basic
            url = window.createObjectURL(file)
        } else if (window.URL != undefined) { // mozilla(firefox)
            url = window.URL.createObjectURL(file)
        } else if (window.webkitURL != undefined) { // webkit or chrome
            url = window.webkitURL.createObjectURL(file)
        }
        return url
    }

    function search() {
        console.log($('#searchText').val())
        var data = $('#searchText').val()
        location.assign('/search?keyword=' + data)
    }

    function load_data() {
        var theme = localStorage.getItem('username')
        var userId = localStorage.getItem('userId')
        console.log(localStorage.getItem('username'))
        console.log(localStorage.getItem('userId'))
        if (theme == null || theme == '') {
            $('#login_logout').text('登录')
            $('#uname').text('')
            $('#wants').hide()
            $('release').hide()
            $('#cart').hide()
        } else {
            $('#login_logout').text('退出')
            $('#login_logout').attr('href', '/logout')
            $('#uname').text(theme)
            $('#wants').show()
            $('#wants').attr('href', '/api/wants/release?userId=' + userId)
            $('#release').show()
            $('#release').attr('href', '/release')
            $('#cart').show()
            $('#cart').attr('href', '/api/cart/all?userId=' + userId)
            $('#uname').attr('href', '/api/user/info?userId=' + userId)
        }
    }

</script>

</html>
